import { createSlice } from '@reduxjs/toolkit'

const initialState = [
  {
    id: 1,
    name: '小赵',
    age: 18,
    address: 'London',
  },
  {
    id: 2,
    name: '小张',
    age: 19,
    address: 'London',
  },
  {
    id: 3,
    name: '小李',
    age: 20,
    address: '东京',
  },
  {
    id: 4,
    name: '小王',
    age: 21,
    address: 'Paris',
  },
  {
    id: 5,
    name: '小黑',
    age: 22,
    address: 'Berlin',
  },
  {
    id: 6,
    name: '小红',
    age: 23,
    address: 'Tokyo',
  },
  {
    id: 7,
    name: '小白',
    age: 24,
    address: 'Singapore',
  },
  {
    id: 8,
    name: '小蓝',
    age: 25,
    address: 'Sydney',
  },
  {
    id: 9,
    name: '小小',
    age: 26,
    address: 'Moscow',
  },
  {
    id: 10,
    name: '将军',
    age: 27,
    address: 'Beijing',
  }
]

export const counterSlice = createSlice({
  name: 'counter',
  initialState,
  reducers: {
    setList: (state, actions) => {
      state = actions.payload
    },
    deleteList: (state, actions) => {
      const index = actions.payload
      state.splice(index, 1)
    },
    editCell: (state, action) => {
      const { index, id, name, age, address } = action.payload
      state[index] = { id, name, age, address }
    }
  },
})

// 这里的actions对应的是上面的reducers function
export const { deleteList, setList, editCell } = counterSlice.actions

export default counterSlice.reducer
